<template>
    <div class="home-banner">
        <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
            <van-swipe-item v-for="item in bannerList" :key="item.id">
                <img :src="item.image_url" alt="">
            </van-swipe-item>
        </van-swipe>
    </div>
</template>

<script setup name="HomeBanner">
// 发送请求，拿到轮播图数据渲染页面
import { getHomeList } from '../../../model/goods';
import { onMounted, ref } from 'vue'


// 准备一个变量，保存轮播图列表
const bannerList = ref([])

// 挂载页面完毕，发送请求，请求轮播图列表
onMounted(async () => {
    const res = await getHomeList()
    if (res.status !== 200) return
    bannerList.value = res.data.data.banner
    // console.log(res)
    // console.log(res.data.data.banner)
})
</script>

<style scoped>
img{
    width: 100%;
    display: block;
}
</style>